﻿@model IEnumerable<WebResourceInfo>
@MvcHtmlString.Create(Html.ScriptRef("plugins/lightbox.js"))
@{
    Ajax.Dna().Widget()
        .UserPreferences(@<text>
    @Html.Hidden(item.GenerateFieldID("Path").ToString(), item.GetString("Path"))
    @(Ajax.Dna().TreeView()
                          .Name(item.GenerateFieldID("FoldersTreeView"))
                          .HtmlAttributes(new { style = "width:auto;height:300px;border:1px solid #cccccc;padding:5px;overflow:auto;margin:0px;" })
                          .Options(opts =>
                      {
                          opts.OnNodeSelected = "var _path=$(\">.d-treenode-content\",node).find(\".d-treenode-value\").val();$(\"#" + item.GenerateFieldID("Path") + "\").val(_path);";
                          opts.OnNodePopulate = (new System.Text.StringBuilder())
                                                                 .Append("var $n = $(node);")
                                                                 .Append("$n.addClass(\"d-treenode-loading\");")
                                                                 .Append("var _url = $(\">.d-treenode-content\", $n).find(\".d-treenode-value\").val();")
                                                                 .Append("$(\"#" + item.GenerateFieldID("FoldersTreeView") + "\").dtree(\"loadNodes\", \"")
                                                                 .Append(Url.Action("GetPaths", "WebFiles", new { Area = "" }) + "\", \"GET\", {url:_url}, $n);")
                                                                 .Append("$n.removeClass(\"d-treenode-hasChildren\");")
                                                                 .ToString();
                          opts.OnNodeLoaded = "if (node) {$(node).removeClass(\"d-treenode-loading\");}";
                      })
                      .SinglePathExpand(true)
                              .ClientBind(Url.Action("GetPaths", "WebFiles", new { Area = "", url =WebSiteContext.Current.ApplicationPath+ UrlResolver.Content(WebSiteContext.Current.Web) }))
                      .ClientNodeTemplate(obj =>
                      {
                          return new HelperResult(writer =>
                          {
                              writer.Write("<li {{if Value}} class=\"d-treenode-hasChildren\" {{/if}}>");
                              writer.Write("<a href=\"javascript:void(0);\" rel=" + Url.Action("GetPaths", "WebFiles", new { Area = "" }) + "?url=${Value}\" title=\"${ToolTip}\" {{if Target}} target=\"${Target}\" {{/if}}>");
                              writer.Write("{{if ImageUrl}} <img src=\"${ImageUrl}\" class=\"d-treenode-img\" alt=\"${Text}\" /> {{/if}}");
                              writer.Write("{{if Value}} <input type=\"hidden\" class=\"d-treenode-value\" value=\"${Value}\" /> {{/if}}");
                              writer.Write("<span class=\"d-treenode-text\">${Text}</span></a></li>");
                          });
                      })
                     .GetHtml())
    <div>
        Thumb image width</div>
    <div>@Ajax.Dna().Number(item.GenerateFieldID("ImageWidth"), item.GetInt("ImageWidth")).GetHtml()</div>
    <div>
        Thumb image height</div>
    <div>@Ajax.Dna().Number(item.GenerateFieldID("ImageHeight"), item.GetInt("ImageHeight")).GetHtml()</div>
    </text>)
        .Content(widget =>
        {
            var _w = widget.GetInt("ImageWidth");
            var _h = widget.GetInt("ImageHeight");
            var _thumbW = (_w * 0.5) + _w - 10;
            var _thumbH = (_h * 0.5) + _h - 6;

            Ajax.DnaFor().ListBox(Model)
                .HtmlAttributes(new { style = "width:auto;height:auto;border:none;margin:5px;" })
                .Name(widget.GenerateFieldID("Albums"))
                .ItemHtmlAttributes(new { style = "width:" + (_w).ToString() + "px;height:" + (_h).ToString() + "px;" })
                .ItemTemplate(@<text>
    <div style="width: @(_w)px; height:@(_h)px;" class="ui-corner-all">
        <table style="width: 100%; height: 100%;">
            <tr>
                <td style="vertical-align: middle; text-align: center;" >
                    <a href="@item.Url.ToString()" target="_blank" title="@item.Name" class="d-img-link">
                        <img src="@(item.Url.ToString() + "?thumb=true&w=" + _thumbW.ToString() + "&h=" + _thumbH.ToString())"  alt="@item.Name"/>
                    </a>
                </td>
            </tr>
        </table>
    </div>
    </text>)
                .Render();
            Ajax.jQuery(widget.GenerateFieldID("Albums"), "album");
            Ajax.RegisterStartupScript("$('#" + widget.GenerateFieldID("Albums") + " .d-img-link').lightBox({fixedNavigation:true,imageLoading:'"
                + Url.Content("~/content/images/lightbox-ico-loading.gif")
                + "',imageBtnPrev:'" + Url.Content("~/content/images/lightbox-btn-prev.gif")
                + "',imageBtnNext:'" + Url.Content("~/content/images/lightbox-btn-next.gif")
                + "',imageBtnClose:'" + Url.Content("~/content/images/lightbox-btn-close.gif")
                + "',imageBlank:'" + Url.Content("~/content/images/lightbox-blank.gif") + "'});");
        })
        .Render();
}
